var HomeSlider = new Class({
	Implements: [Events, Options],

	options: {
		changeDuration: 1200,
		intervalDuration: 7000
	},

	initialize: function(options){
		if($$('#in_progress').length == 0)
			return;

		this.running = false;
		this.setOptions(options);
		this.container = $('in_progress');
		this.controls = this.container.getElements('.controls')[0];
		this.controlPrevious = this.controls.getElement('.arrow.previous');
		this.controlNext = this.controls.getElement('.arrow.next');

		this.timer = null;
		this.items = this.container.getElements('.item');
		this.bullets = this.container.getElements('.bullets .bullet');
		this.highlightsContainer = this.container.getElements('.highlights')[0];
		this.highlights = this.highlightsContainer.getElements('.highlight');

		this.nbItems = this.items.length;

		if(this.nbItems < 2)
			return;

		this.currentItem = 0;
		this.build();
		this.enable();
	},

	build: function(){
		this.controlPrevious.addEvent('click', function(e){
			e.stop();
			this.disable();
			this.previous();
		}.bind(this));

		this.controlNext.addEvent('click', function(e){
			e.stop();
			this.disable();
			this.next();
		}.bind(this));

		this.items.each(function(item, index){
			item.store('fx', new Fx.Morph(item, {
				link: 'cancel',
				duration: this.options.changeDuration
			}));
		}.bind(this));

		this.highlightsContainer.store('fx', new Fx.Morph(this.highlightsContainer, {
			link: 'cancel',
			duration: this.options.changeDuration/2
		}));

		this.bullets.each(function(bullet, index){
			bullet.addEvent('click', function(){
				this.disable();
				this.show(index);
			}.bind(this));
		}.bind(this));
	},

	previous: function(){
		var index = this.currentItem-1;
		if(index < 0)
			index = this.nbItems-1;
		this.show(index);
	},

	next: function(){
		this.show((this.currentItem+1)%this.nbItems);
	},

	show: function(index){
		if(this.running)
			return;
		this.running = true;

		var itemOld = this.items[this.currentItem];
		var bulletOld = this.bullets[this.currentItem];
		var highlightOld = this.highlights[this.currentItem];
		this.currentItem = index;
		var itemNew = this.items[this.currentItem];
		var bulletNew = this.bullets[this.currentItem];
		var highlightNew = this.highlights[this.currentItem];

		bulletOld.removeClass('selected');
		bulletNew.addClass('selected');

		this.highlightsContainer.retrieve('fx').start({
			'opacity': 0
		}).chain(function(){
				highlightOld.removeClass('selected');
				highlightNew.addClass('selected');
				this.highlightsContainer.retrieve('fx').start({
					'opacity': 1
				});
			}.bind(this));

		itemNew.setStyles({
			'z-index' : 2,
			'left' : 0
		});

		itemNew.retrieve('fx').start({
			'width': itemNew.getElement('img').getSize().x
		}).chain(function(){
				itemNew.setStyles({
					'z-index' : 1,
					'width' : '100%'
				});
				itemOld.setStyle('width', 0);
				this.running = false;
				this.enable();
			}.bind(this));
	},

	enable: function(){
		if(this.timer)
			return;

		this.timer = setInterval(function(){
			this.next();
		}.bind(this), this.options.intervalDuration);
	},

	disable: function(){
		if(!this.timer)
			return;

		clearInterval(this.timer);
		this.timer = null;
	}
});

var Quotes = new Class({
	Implements: [Events, Options],

	options: {
		fadeDuration: 500, // 500
		intervalDuration: 5000 // 1500
	},

	initialize: function (options) {
		if($$('#quotes')[0].length == 0)
			return;

		this.setOptions(options);
		this.container = $('quotes');
		this.quotes = this.container.getElements('.quote');
		if(this.quotes.length < 2)
			return;

		this.currentIndex = 0;
		this.build();
	},

	build: function(){
		this.quotes.each(function(quote){
			quote.store('fx', new Fx.Morph(quote, {
				link: 'cancel',
				duration: this.options.fadeDuration
			}));
		}.bind(this));

		setInterval(function(){
			this.show((this.currentIndex+1)%this.quotes.length);
		}.bind(this), this.options.intervalDuration);
	},

	show: function(index){
		var oldQuote = this.quotes[this.currentIndex];
		this.currentIndex = index;
		var newQuote = this.quotes[this.currentIndex];

		oldQuote.retrieve('fx').start({
			'opacity': 0
		}).chain(function(){
				oldQuote.setStyles({
					'opacity' : 1,
					'display' : 'none'
				});
				newQuote.setStyles({
					'display' : 'block',
					'opacity' : 0
				});
				newQuote.retrieve('fx').start({
					'opacity': 1
				});
			}.bind(this));
	}
});

var HomeFeed = new Class({
	options: {
		fadeDuration: 300,
		slideDuration: 300,
		changeDuration: 4000
	},

	initialize: function () {
		if($$('#home_feed').length == 0)
			return;

		this.activeSlide = false;
		this.homeFeed = $('home_feed');
		this.homeFeedUl = this.homeFeed.getElements('ul')[0];
		this.items = this.homeFeedUl.getElements('li');

		if(this.items.length == 0)
			return;

		this.build();
		this.enable();
	},

	build: function(){
		var oldX = -1;
		this.homeFeedUl.store('fx', new Fx.Morph(this.homeFeed, {
			link: 'cancel',
			duration: this.options.slideDuration
		}));

		// Desktop
		this.homeFeed.addEvent('mousedown', function(event){
			this.callbackStart(event);
		}.bind(this));

		window.addEvent('mouseup', function(event){
			this.callbackEnd(event);
		}.bind(this));

		// Mobile
		this.homeFeed.addEvent('touchstart', function(event){
			this.callbackStart(event);
		}.bind(this));

		window.addEvent('touchend', function(event){
			this.callbackEnd(event);
		}.bind(this));

		// Hover
		this.items.each(function(item){
			var hover = item.getElement('.hover');
			hover.setStyles({
				'display':'block',
				'opacity':0
			});

			hover.store('fx', new Fx.Morph(hover, {
				link: 'cancel',
				duration: this.options.fadeDuration
			}));

			item.addEvents({
				'mouseover': function(){
					//this.disable();
					this.showItem(item);
				}.bind(this),
				'mouseout': function(){
					//this.enable();
					this.hideItem(item);
				}.bind(this)
			});
		}.bind(this));
	},

	callbackStart: function(event){
		if(this.activeSlide)
			return;
		//alert('touchstart');
		this.activeSlide = true;
		event.stop();
		this.currentX = event.page.x;
		this.oldX = 0;
		window.addEvent('mousemove', function(e){
			this.callbackMove(e);
		}.bind(this));

		window.addEvent('touchmove', function(e){
			this.callbackMove(e);
		}.bind(this));
	},

	callbackEnd: function(event){
		if(!this.activeSlide)
			return;
		//alert('touchend');
		this.activeSlide = false;
		event.stop();

		window.removeEvents('mousemove');
	},

	callbackMove: function(event){
		this.oldX = this.currentX;
		this.currentX = event.page.x;
		this.move(this.currentX-this.oldX);
	},

	move: function(value, forced){
		if(!this.activeSlide && !forced)
			return;
		var marginleft = this.homeFeedUl.getStyle('margin-left').toInt();
		marginleft += value;

		var max = window.getSize().x-this.items.length*this.items[0].getSize().x;
		if(marginleft <= max)
			marginleft = max;
		else if(marginleft >=0)
			marginleft = 0;
		this.homeFeedUl.setStyle('margin-left', marginleft);
	},

	enable: function(){
		this.timer = setInterval(function(){
			this.move(-1, true);
		}.bind(this), 70);
	},

	disable: function(){
		clearInterval(this.timer);
	},

	showItem: function(item){
		if(!isDesktop())
			return;
		this.disable();
		item.getElement('.hover').retrieve('fx').start({
			'opacity': 1
		});
	},

	hideItem: function(item){
		if(!isDesktop())
			return;
		this.enable();
		item.getElement('.hover').retrieve('fx').start({
			'opacity': 0
		});
	}
});